<template>
  <div class="su-container">
    <div class="dashboard-text">
      <div style="color:#488DFF;font-size:16px;" class="lef">
        <i />
        行业分类
        <span style="margin-left:5px;color:#333;">/ 添加行业</span>
      </div>
    </div>
    <div class="su_con">
      <el-form ref="form" :model="form" label-width="214">
        <el-form-item label="分类名称:">
          <el-input v-model="form.tradeName" placeholder="请输入名称:" />
        </el-form-item>
        <el-form-item label="上级分类:">
          <!-- <el-select v-model="form.parentId" placeholder="请选择分类">
            <el-option
            v-for="item in tradeoptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
          </el-select> -->
          <el-input v-model="form.parentName" :placeholder="form.parentName" :disabled="true" />
        </el-form-item>

        <p>不选择分类默认为顶级分类</p>
        <!-- <el-form-item label="排序:">
          <el-input placeholder="请输入排序" v-model="form.name"></el-input>
        </el-form-item>-->
        <!-- <div class="xianshi">
          <el-form-item label="是否显示:">
            <el-radio-group v-model="radio2">
              <el-radio :label="3">是</el-radio>
              <el-radio :label="6">否</el-radio>
            </el-radio-group>
          </el-form-item>
        </div>
        <div class="xianshi">
          <el-form-item label="是否显示在浏览栏:">
            <el-radio-group v-model="radio2">
              <el-radio :label="3">是</el-radio>
              <el-radio :label="6">否</el-radio>
            </el-radio-group>
          </el-form-item>
        </div>-->
        <el-form-item label="活动形式:">
          <el-input v-model="form.remarks" type="textarea" placeholder="请输入内容" />
        </el-form-item>
        <el-button type="primary" @click="onSubmit">提交</el-button>
      </el-form>
    </div>
  </div>
</template>
<script>
import { sendIndustry } from '@/api/usermanage'
import { setTimeout } from 'timers'
export default {
  data() {
    return {
      form: {
        tradeName: '',
        parentId: '',
        parentName: '',
        tradeLevel: '',
        searchState: '',
        viewState: '',
        tradeSort: '',
        remarks: ''
      },
      radio2: 3,
      classvalue: '',
      tradeoptions: []
    }
  },
  created() {
    this.setFromLast()
  },
  methods: {
    onSubmit() {
      const { parentId, remarks, tradeName } = this.form
      console.log(parentId, remarks, tradeName)
      const _this = this
      if (parentId && remarks && tradeName) {
        sendIndustry({
          parentId: parentId,
          remarks: remarks,
          tradeName: tradeName
        }).then(res => {
          this.$message('新增下级成功')
          setTimeout(() => {
            _this.$router.push('user-industry')
            //  this.setFromLast();
          }, 800)
        })
      } else {
        this.$alert('提交失败', '添加下级', {
          confirmButtonText: '确定',
          callback: action => {
            this.$message({
              type: 'info',
              message: `action: ${action}`
            })
          }
        })
      }
    },
    setFromLast() {
      const { tradeName, tradeCode } = this.$route.query.id
      // console.log(tradeName, tradeCode);
      this.$set(this.form, 'parentName', tradeName)
      this.$set(this.form, 'parentId', tradeCode)
      // this.from.parentName = tradeName
      // this.from.parentId = tradeCode
      // console.log(this.from.parentName, this.from.parentId);
    }
  }
}
</script>
<style lang="scss">
.su-container {
  margin: 0;
  padding: 0;
  padding-left: 26px;
  .dashboard-text {
    margin-top: 17px;
    width: 100%;
    overflow: auto;
    height: 37px;
    .lef {
      line-height: 37px;
      font-size: 16px;
      font-weight: 900;
      color: #333;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      i {
        display: inline-block;
        width: 11px;
        height: 20px;
        background: #488dff;
        border-radius: 4px;
        margin-right: 12px;
      }
    }
    .rig {
      font-size: 14px;
      width: 76px;
      height: 37px;
      text-align: center;
      line-height: 37px;
      background: #488dff;
      border-radius: 4px;
      line-height: 37px;
      display: flex;
      justify-content: center;
      align-items: center;
      color: #fff;
      cursor: pointer;
    }
  }
  // form
  .su_con {
    width: 1549px;
    height: 613px;
    padding: 48px 0 48px 0;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    .el-form {
      height: 567px;
      position: relative;

      .el-form-item {
        margin-bottom: 25px;
        .el-textarea__inner {
          width: 444px !important;
          height: 211px !important;
          border-radius: 3px !important;
          outline: none !important;
          border: 1px solid #dcdfe6 !important;
        }
        .el-form-item__label {
          float: left !important;
          width: 214px !important;
          padding: 0 !important;
          height: 36px !important;
          line-height: 36px !important;
          font-size: 16px !important;
          font-family: PingFangSC-Regular !important;
          font-weight: 400 !important;
          color: rgba(102, 102, 96, 1) !important;
        }
        .el-form-item__content {
          width: 444px !important;
          height: 36px !important;
          line-height: 36px !important;
          float: left !important;
          margin-left: 8px !important;
          .el-input__inner {
            height: 36px !important;
            line-height: 36px !important;
          }
        }
      }
      p {
        margin: -9px 0 25px 223px;
        width: 200px;
        height: 17px;
        font-size: 12px;
        font-family: PingFangSC-Regular;
        font-weight: 400;
        color: rgba(153, 153, 153, 1);
        line-height: 17px;
      }
      .xianshi {
        .el-form-item {
          height: 24px !important;
          line-height: 24px !important;

          .el-form-item__label {
            float: left !important;
            width: 214px !important;
            padding: 0 !important;
            height: 24px !important;
            line-height: 24px !important;
            font-size: 16px !important;
            font-family: PingFangSC-Regular !important;
            font-weight: 400 !important;
            color: rgba(102, 102, 96, 1) !important;
          }
          .el-form-item__content {
            height: 24px !important;
            line-height: 24px !important;
          }
        }
      }
      //   按钮
      .el-button--primary {
        position: absolute;
        bottom: -68px;
        left: 758px;
        width: 100px !important;
        height: 40px !important;
        background: rgba(72, 141, 255, 1) !important;
        border-radius: 2px !important;
      }
    }
  }
}
</style>
